const chatWindow = document.getElementById('chat-window');
const messageInput = document.getElementById('message-input');
const sendButton = document.getElementById('send-button');

sendButton.addEventListener('click', function() {
    const message = messageInput.value.trim();
    if (message) {
        // 准备要发送的数据，转换为 JSON 格式
        const data = {
            message: message
        };

        messageInput.value = '';
        addMessageBox(message, 'user-message');

        // 使用 fetch 发送 POST 请求
        fetch('/send_message', { // 假设后端处理 POST 请求的路由是 /send_message
            method: 'POST',
            headers: {
                'Content-Type': 'application/json' // 设置请求头，指明发送的数据是 JSON 格式
            },
            body: JSON.stringify(data) // 将 JavaScript 对象转换为 JSON 字符串
        })
        .then(response => response.json()) // 解析响应数据为 JSON
        .then(data => {
            console.log('Success:', data);
            // 这里可以添加代码处理响应，例如清空输入框
            addMessageBox(data.message, 'robot-message');
        })
        .catch((error) => {
            console.error('Error:', error);
        });
    }
});

function addMessageBox(text, clazz) {
    const message = document.createElement('div');
    message.classList.add('message', clazz); // 'user-message', 'robot-message'
    message.textContent = text;
    chatWindow.appendChild(message);
    chatWindow.scrollTop = chatWindow.scrollHeight;
}


let isComposing = false; // 标记是否处于输入组合字符状态
messageInput.addEventListener('compositionstart', () => {
    isComposing = true; // 输入法开始输入时设置为true
});
messageInput.addEventListener('compositionend', () => {
    isComposing = false; // 输入法结束输入时设置为false
});

messageInput.addEventListener('keydown', function(event) {
    // 检查是否按下的是回车键
    if (event.keyCode === 13 || event.key === 'Enter') {
        // 如果用户正在输入组合字符，不执行发送操作
        if (isComposing) {
            event.preventDefault(); // 阻止默认的Enter键行为
            return;
        }
        // 发送消息的代码...
        sendButton.click();
    }
});

window.addEventListener('load', function() {
    addMessageBox('你好，我是星火认知大模型，欢迎找我聊天。', 'robot-message');
});
